<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style type="text/css">
	body {height: 2000px;}
	#div1 { width: 100px; height: 200px; background-color: red;position: absolute;right: 0;}
	</style>
	<script type="text/javascript">
	window.onload = function (){
		var oDiv = document.getElementById('div1');
		var _pos = ( document.documentElement.clientHeight - oDiv.offsetHeight )/2;

		//初始化
		oDiv.style.top = _pos + 'px';

		window.onscroll = function (){
			var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
			var posTop = scrollTop + _pos;
			//***** 注意并不是oDiv.style.top，而是自身高度offsetHeight *****			
			posTop = parseInt( posTop );		//posTop本身很有可能是带有小数的（带有0.5），这会导致div到达终点的后因满足不了值而抖动

			oDiv.style.top = posTop+'px';
		}
	}
	</script>
</head>
<body>
	<div id="div1"></div>
</body>
</html>